<template>
    <div class="chart"></div>
</template>

<script>
let echarts = require("echarts/lib/echarts");
require("echarts/lib/chart/map");
import "./guangdong.js";
import opt from "./opt";
import data from "./data";
let storeChart = {};
let localParams = {};
export default {
    name: "guangdong",
    data() {
        return {
            random: ""
        };
    },
    mounted() {
        localParams = {
            data: data
        };
        this.random = "";
        //this.initChart(localParams);
        
    },
    methods: {
        getChart(){
            return storeChart[this.random];
        },
        initChart(params) {
            let paramRender = { ...localParams, ...params };

            if (storeChart[this.random]) {
                storeChart[this.random].clear();
            } else {
                this.random = Math.ceil(Math.random() * 10000);
                storeChart[this.random] = echarts.init(this.$el);
            }
            storeChart[this.random].setOption(opt(paramRender), true);
        }
    },
    beforeDestroy() {
        if (storeChart[this.random]) {
            storeChart[this.random].dispose();
            storeChart[this.random] = null;
            storeChart = {};
            this.random = "";
        }
    }
};
</script>

<style lang="css" scoped>
.chart {
    height: 690px;
    width: 100%;
}
</style>

